import React, { useImperativeHandle, useState } from 'react';
import { Modal, ModalProps } from 'antd';

const CustomModal = (props: JSX.IntrinsicAttributes & ModalProps & { children?: React.ReactNode; }, ref: ((instance: unknown) => void) | React.RefObject<unknown> | null | undefined) => {
  // console.log(props);
  const [isModalVisible, setIsModalVisible] = useState(false);
  useImperativeHandle(ref, () => ({
    showModal,
    handleOk,
  }));
  const showModal = () => {
    setIsModalVisible(true);
  };

  const handleOk = () => {
    setIsModalVisible(false);
  };

  const handleCancel = () => {
    setIsModalVisible(false);
  };

  return (
    <Modal
      {...props}
      visible={isModalVisible}
      onOk={handleOk}
      onCancel={handleCancel}
    >
      {props.children}
    </Modal>
  );
};

export default React.forwardRef(CustomModal);